<template>
  <div class="app-container">
    <!-- 对话框(添加 / 修改) -->
    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="45%" v-dialogDrag append-to-body>
      <el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="100px">
        <el-form-item label="质检方案Id" prop="inspectionSchemeId">
          <el-input v-model="formData.inspectionSchemeId" placeholder="请输入质检方案Id"/>
        </el-form-item>
        <el-form-item label="质检项名称" prop="itemName">
          <el-input v-model="formData.itemName" placeholder="请输入质检项名称"/>
        </el-form-item>
        <el-form-item label="质检项分类-字典值quality_inspection_scheme_item_type" prop="itemType">
          <el-select v-model="formData.itemType" placeholder="请选择质检项分类-字典值quality_inspection_scheme_item_type">
            <el-option label="请选择字典生成" value=""/>
          </el-select>
        </el-form-item>
        <el-form-item label="质检项分类名称" prop="itemTypeName">
          <el-input v-model="formData.itemTypeName" placeholder="请输入质检项分类名称"/>
        </el-form-item>
        <el-form-item label="数值类型1-字符(外观)2-数字3-日期4-是/否 5-字符(功能)" prop="itemDataType">
          <el-select v-model="formData.itemDataType" placeholder="请选择数值类型1-字符(外观)2-数字3-日期4-是/否 5-字符(功能)">
            <el-option label="请选择字典生成" value=""/>
          </el-select>
        </el-form-item>
        <el-form-item label="录入方式:0-无1-手工录入2-按标准值校验" prop="inputMethod">
          <el-input v-model="formData.inputMethod" placeholder="请输入录入方式:0-无1-手工录入2-按标准值校验"/>
        </el-form-item>
        <el-form-item label="标准值" prop="otherDefect">
          <el-input v-model="formData.otherDefect" placeholder="请输入标准值"/>
        </el-form-item>
        <el-form-item label="上公差" prop="upperValue">
          <el-input v-model="formData.upperValue" placeholder="请输入上公差"/>
        </el-form-item>
        <el-form-item label="下公差" prop="lowerValue">
          <el-input v-model="formData.lowerValue" placeholder="请输入下公差"/>
        </el-form-item>
        <el-form-item label="下警戒值" prop="lowerBias">
          <el-input v-model="formData.lowerBias" placeholder="请输入下警戒值"/>
        </el-form-item>
        <el-form-item label="上警戒值" prop="upperBias">
          <el-input v-model="formData.upperBias" placeholder="请输入上警戒值"/>
        </el-form-item>
        <el-form-item label="SPC坐标" prop="excelCoordinate">
          <el-input v-model="formData.excelCoordinate" placeholder="请输入SPC坐标"/>
        </el-form-item>
        <el-form-item label="检验默认值" prop="defaultValue">
          <el-input v-model="formData.defaultValue" placeholder="请输入检验默认值"/>
        </el-form-item>
        <el-form-item label="SPC检" prop="spcInspection">
          <el-input v-model="formData.spcInspection" placeholder="请输入SPC检"/>
        </el-form-item>
        <el-form-item label="全尺寸检" prop="fullSizeInspection">
          <el-input v-model="formData.fullSizeInspection" placeholder="请输入全尺寸检"/>
        </el-form-item>
        <el-form-item label="全尺寸坐标" prop="fullSizeCoordinate">
          <el-input v-model="formData.fullSizeCoordinate" placeholder="请输入全尺寸坐标"/>
        </el-form-item>
        <el-form-item label="量具坐标" prop="toolCoordinate">
          <el-input v-model="formData.toolCoordinate" placeholder="请输入量具坐标"/>
        </el-form-item>
        <el-form-item label="文件名称代码" prop="failNameCode">
          <el-input v-model="formData.failNameCode" placeholder="请输入文件名称代码"/>
        </el-form-item>
        <el-form-item label="不良判定方式:0-无1-手工输入2-枚举选择" prop="defectMethod">
          <el-input v-model="formData.defectMethod" placeholder="请输入不良判定方式:0-无1-手工输入2-枚举选择"/>
        </el-form-item>
        <el-form-item label="不良原因" prop="badReasons">
          <el-input v-model="formData.badReasons" placeholder="请输入不良原因"/>
        </el-form-item>
        <el-form-item label="备注" prop="memo">
          <el-input v-model="formData.memo" placeholder="请输入备注"/>
        </el-form-item>
        <el-form-item label="排序字段" prop="sort">
          <el-input v-model="formData.sort" placeholder="请输入排序字段"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" :disabled="formLoading">确 定</el-button>
        <el-button @click="dialogVisible = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import * as InspectionSchemeItemApi from '@/api/quality/inspectionschemeitem';

export default {
  name: "InspectionSchemeItemForm",
  components: {},
  data() {
    return {
      // 弹出层标题
      dialogTitle: "",
      // 是否显示弹出层
      dialogVisible: false,
      // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
      formLoading: false,
      // 表单参数
      formData: {
        id: undefined,
        inspectionSchemeId: undefined,
        itemName: undefined,
        itemType: undefined,
        itemTypeName: undefined,
        itemDataType: undefined,
        inputMethod: undefined,
        otherDefect: undefined,
        upperValue: undefined,
        lowerValue: undefined,
        lowerBias: undefined,
        upperBias: undefined,
        excelCoordinate: undefined,
        defaultValue: undefined,
        spcInspection: undefined,
        fullSizeInspection: undefined,
        fullSizeCoordinate: undefined,
        toolCoordinate: undefined,
        failNameCode: undefined,
        defectMethod: undefined,
        badReasons: undefined,
        memo: undefined,
        sort: undefined,
      },
      // 表单校验
      formRules: {
        sort: [{required: true, message: '排序字段不能为空', trigger: 'blur'}],
      },
    };
  },
  methods: {
    /** 打开弹窗 */
    async open(id) {
      this.dialogVisible = true;
      this.reset();
      // 修改时，设置数据
      if (id) {
        this.formLoading = true;
        try {
          const res = await InspectionSchemeItemApi.getInspectionSchemeItem(id);
          this.formData = res.data;
          this.title = "修改质检方案质检项";
        } finally {
          this.formLoading = false;
        }
      }
      this.title = "新增质检方案质检项";
    },
    /** 提交按钮 */
    async submitForm() {
      // 校验主表
      await this.$refs["formRef"].validate();
      this.formLoading = true;
      try {
        const data = this.formData;
        // 修改的提交
        if (data.id) {
          await InspectionSchemeItemApi.updateInspectionSchemeItem(data);
          this.$modal.msgSuccess("修改成功");
          this.dialogVisible = false;
          this.$emit('success');
          return;
        }
        // 添加的提交
        await InspectionSchemeItemApi.createInspectionSchemeItem(data);
        this.$modal.msgSuccess("新增成功");
        this.dialogVisible = false;
        this.$emit('success');
      } finally {
        this.formLoading = false;
      }
    },
    /** 表单重置 */
    reset() {
      this.formData = {
        id: undefined,
        inspectionSchemeId: undefined,
        itemName: undefined,
        itemType: undefined,
        itemTypeName: undefined,
        itemDataType: undefined,
        inputMethod: undefined,
        otherDefect: undefined,
        upperValue: undefined,
        lowerValue: undefined,
        lowerBias: undefined,
        upperBias: undefined,
        excelCoordinate: undefined,
        defaultValue: undefined,
        spcInspection: undefined,
        fullSizeInspection: undefined,
        fullSizeCoordinate: undefined,
        toolCoordinate: undefined,
        failNameCode: undefined,
        defectMethod: undefined,
        badReasons: undefined,
        memo: undefined,
        sort: undefined,
      };
      this.resetForm("formRef");
    }
  }
};
</script>
